<!doctype html>
<html>

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <title>shareinstall</title>
  <meta name="viewport" content="initial-scale=1, maximum-scale=1" />
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  <style>
    * {
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    }

    p {
      margin: 0;
    }
  </style>
</head>

<body style="background: #ffffff">
  <div class="channel-ok" style="display: none">
    <div style="position: absolute;top: 0;right: 0;bottom: 0;left: 0;overflow: auto;width: 100%">
      <!-- 这里是页面内容区 -->
      <div style="background: url(./img/overview/landing_bg.png) no-repeat;height:44%;background-size: cover;position: relative">
        <div style="position: absolute;width:100px;height: 100px;border: 1px solid #e5e5e5;border-radius: 15px;left: 50%;top: 100%;margin-top: -50px;margin-left: -50px;">
      <img class="icon" src="" alt="" style="width: 100px;height: 100px;"/>
      <div style="height:6px;background: rgba(0,0,0,1);opacity: 0.1;text-align: center;border-radius: 50%;margin-top: 5px"></div>
  </div>
      </div>
      <p class="name" style="font-size:2em;margin: 2.3em 0 0.3em;;text-align: center;color: #282828">shareinstall</p>
      <div style="margin: 1.75rem 0;padding: 0 0.75rem;color: #6d6d72;">
        <p>
          <a href="javascript:;" id="downloadButton" style="visibility:hidden;background:#00a4ff;color:#fff;border:1px solid #00a4ff;text-align:center;display:block;border-radius:0.25rem;padding:0 0.5rem;margin:0;cursor:pointer;height:3rem;line-height:3rem;text-decoration: none;font-size: 1em">立即下载</a>
        </p>
      </div>
    </div>
  </div>
  <div class="channel-no" style="display: none">
    <div style="text-align: center">
      <img src="./img/install/error.png" alt="" style="display: block; max-width: 100%; height: auto; margin: 0 auto;">
    </div>
    <!-- <p style="text-align: center; font-size: 2em; color: #333">抱歉，出错了！</p> -->
    <p style="text-align: center; font-size: 1em; color: #666; padding: 1em 1.5em">非法链接</p>
  </div>
  <script src="./js/common/base.min.js"></script>
  <script type="text/javascript" src="./js/page/shareinstall.min.js"></script>
  <script type="text/javascript">
    //错误处理：确保app始终能正常的安装
    var timer = setTimeout(
      function () {
        var button = document.getElementById("downloadButton");
        button.style.visibility = "visible";
        button.onclick = function () {
          var ua = navigator.userAgent;
          if (ua.indexOf(" MicroMessenger/") > -1) {
            //微信中显示遮罩提示在浏览器中打开或进入应用宝
            var div = document.createElement("div");
            div.innerHTML = "<div style='font-size:2rem;color:#fff;text-align:center;" +
              "position:fixed;left:0;top:0;background:rgba(0,0,0,0.5);filter:alpha(opacity=50);" +
              "width:100%;height:100%;z-index:10000;'>点击右上角在浏览器中打开</div>";
            document.body.appendChild(div);
          } else {
            if (ua.indexOf("Android") > -1) {
              //直接下载apk
              //window.location="apk地址";
            } else if (ua.indexOf("iPhone") > -1 || ua.indexOf("iPad") > -1 || ua.indexOf("iPod") > -1) {
              //直接进入appstore
              //window.location="appstore地址";
            }
          }
        }
      }, 5000);

    //shareinstall初始化，初始化时将与shareinstall服务器交互，应尽可能早的调用
    /*web页面向app传递的json数据(json string/js Object)，应用被拉起或是首次安装时，通过相应的android/ios api可以获取此数据*/
    var data = ShareInstall.parseUrlParams(); //ShareInstall.js中提供的工具函数，解析url中的所有查询参数
    var copyData = JSON.parse(JSON.stringify(data))
    delete data.appkey

    // 查询渠道是否过期
    $.ajax({
      url: 'http://api.shareinstall.com/channel/verify',
      type: 'POST',
      data: {
        app_key: copyData.appkey,
        channel_code: copyData.channel
      },
      crossDomain: true == !(document.all),
      success: function (res) {
        if (res.code == 0 && res.data.flag == 1) {
          $('.channel-ok').show()
          pageSDK()
        } else {
          $('.channel-no').show()
        }
      }
    })

    function pageSDK() {
      // 页面信息渲染
      $.ajax({
        url: 'http://api.shareinstall.com/appliance/getone',
        type: 'POST',
        data: {
          app_key: copyData.appkey
        },
        crossDomain: true == !(document.all),
        success: function (res) {
          $('.icon').attr('src', res.data.icon)
          $('.name').text(res.data.name)
        }
      })
      // console.log(copyData.appkey)
      new ShareInstall({
      /*appKey必选参数，ShareInstall平台为每个应用分配的ID*/
      appKey: copyData.appkey,
      /*可选参数，自定义android平台的apk下载文件名，只有apk在ShareInstall托管时才有效；个别andriod浏览器下载时，中文文件名显示乱码，请慎用中文文件名！*/
      //apkFileName : 'io.ShareInstall.monitor-v1.0.1.apk',
      /*可选参数，是否优先考虑拉起app，以牺牲下载体验为代价*/
      //preferWakeup:true,
      /*ShareInstall初始化完成的回调函数，可选*/
      onready: function () {
        //ShareInstall已成功回调，清除定时器
        clearTimeout(timer);
        timer = null;

        var m = this,
          button = document.getElementById("downloadButton");
        button.style.visibility = "visible";

        /*在app已安装的情况尝试拉起app*/
        // m.schemeWakeup();
        /*用户点击某个按钮时(假定按钮id为downloadButton)，安装app*/
        button.onclick = function () {
          m.wakeupOrInstall();
        }
      }
    }, data);
    }
  </script>
</body>

</html>